<template>
  <!-- 播放所有组件 -->
  <div class="play-all">
    <div class="play-left">
      <i class="iconfont icon-bofang"></i>
      <span>播放全部</span>
    </div>
    <div class="play-right">+</div>
  </div>
</template>

<script setup>
</script>
<style lang='less'>
@import url(../../assets/fonts/tab/iconfont.css);
@import url(../../assets/fonts/song-list/iconfont.css);

.play-all {
  display: flex;
  .play-left,
  .play-right {
    background-color: #ec4141;
    color: white;
    text-align: center;
    line-height: 30px;
    transition: all 0.2s;

    &:hover {
      cursor: pointer;
      background-color: #cc3232;
    }
  }

  .play-left {
    width: 100px;
    height: 30px;
    border-radius: 15px 0 0 15px;
    border-right: 1px solid rgba(212, 212, 212, 0.192);

    i {
      font-size: 13px;
    }

    span {
      margin-left: 8px;
      font-size: 13px;
    }
  }

  .play-right {
    width: 35px;
    height: 30px;
    border-radius: 0 15px 15px 0;
    font-size: 18px;
  }
}
</style>